﻿@{
    Layout = "_CustomerLayout";
    ViewData["Title"] = "订单信息";
    ViewData["Name"] = "hujiajun";
}

<link rel="stylesheet" href="~/layui/css/layui.css" media="all">
<table class="layui-table" lay-data="{url:'/Customer/test', id:'test3'}" lay-filter="test3">
    <thead>
        <tr>
            <th lay-data="{type:'checkbox'}">ID</th>
            <th lay-data="{field:'id', width:80, sort: true}">ID</th>
            <th lay-data="{field:'cname', width:120, sort: true, edit: 'text'}">用户名</th>
            <th lay-data="{field:'bookName', edit: 'text', minWidth: 150}">书名</th>
            <th lay-data="{field:'bookNumber', width:80, edit: 'text'}">数量</th>
            <th lay-data="{field:'bookPrice', edit: 'text', minWidth: 100}">单价</th>
            <th lay-data="{field:'totalPrice', sort: true, edit: 'text'}">总价</th>

            <th lay-data="{field:'orderTime', sort: true, edit: 'text'}">下单时间</th>

            <th lay-data="{field:'orderState', sort: true, edit: 'text'}">当前状态</th>

            <th lay-data="{field:'address', sort: true, edit: 'text'}">收货地址</th>
        </tr>
    </thead>
</table>


@section Scripts{
    <script src="~/layui/layui.js" charset="utf-8"></script>
    <!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
    <script>
        layui.use('table', function () {
            var table = layui.table;

            //监听单元格编辑
            table.on('edit(test3)', function (obj) {
                var value = obj.value //得到修改后的值
                    , data = obj.data //得到所在行所有键值
                    , field = obj.field; //得到字段
                //TODO 在这发ajax请求到后端更改数据库数据！！！！没错！！！就是这样！！
                layer.msg('[ID: ' + data.id + '] ' + field + ' 字段更改为：' + value);
            });
        });
    </script>
}
